<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加操作</title>
  <script>
    function  f1(){
      let a = document.getElementById("a");
    //   1.创建一个div标签
      let d=document.createElement("div");
      let text = document.createTextNode("这是新增的div")
      // 3.将创建的文本节点添加到元素节点div中的标签体的末尾
      d.appendChild(text);
      // 将div放到超链接的标签体的末尾
      // a.appendChild(d);

      // 将div放在超链接之前
      // 放置后,div与超链接都属于body的子节点
      let b = document.getElementById("b");
      // 同时添加div和超链接
      // b.insertBefore(d,a);

      // 使用div替换原有的超链接
      b.replaceChild(d,a);

    }
  </script>
</head>
<body>
<a href="javascript:" onclick="f1()" id="a">超链接</a>
</body>
</html>